
<#include
        "../../common/com.html"  /> <@layout>
<head>
    <!-- page specific plugin styles -->
   
    <script src="${ctx}/static/inc/platform/js/ajax.js"></script>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/cbb/artDialog/skins/blue.css">
    <script src="${ctx}/static/cbb/artDialog/jquery.artDialog.js"></script>
</head>
<script type="text/javascript">
    //open new window
    function newModels(){
        var url = '${ctx}/wxMessage/newModes' ;
        initArtDialog({url:url, title:'新增', width:"90%", height:"90%",lock:true,background: '#EAEAEA'});
    }

    /**
     * 删除选中的模型信息
     */
    function dels(obj,yxbz){
        var url = '${ctx}/wxMessage/delete/';
        $("#id").attr("value",obj);
        $('#myform').form('submit', {
            url : url,
            onSubmit : function() {
            },
            success : function(data) {
                // 回填页面
                alert(data);
                window.location.reload();
            }
        });
    }

</script>
<body>

<div class="page-content">
    <div class="page-header" style="height: 15px">

        关键词自动回复设置
    </div><!-- /.page-header -->

    <div class="row-fluid">
        <div class="span12">
            <form class="form-inline" id="myform">
                <input type="hidden" name="id" id="id">

                <button id="search_btn" onclick="return false;" class="btn btn-info btn-small"  onclick="queryModel()">
                    <i class="icon-key bigger-110"></i>
                    查询
                </button>
                <a href="#"  class="btn btn-danger btn-small bigger-110"   onclick="cleankhid();">取消 </a>

            </form>
            <!-- PAGE CONTENT BEGINS -->
            <table id="grid-table"></table>
            <div id="grid-pager"></div>
            <!-- PAGE CONTENT ENDS -->
        </div><!-- /.span -->
    </div><!-- /.row-fluid -->
</div><!-- /.page-content -->
<!-- page specific plugin scripts -->

<script src="${ctx}/static/assets/js/jqGrid/jquery.jqGrid.min.js"></script>
<script src="${ctx}/static/assets/js/jqGrid/i18n/grid.locale-cn.js"></script>
<script src="${ctx}/static/assets/js/markdown/markdown.min.js"></script>
<script src="${ctx}/static/assets/js/markdown/bootstrap-markdown.min.js"></script>

<script>
    function add(){
        var url = '${ctx}/wxMessage/newModes?id=' ;
        initArtDialog({url:url, title:'新增',width:"90%", height:"90%",lock:true,background: '#EAEAEA'});
    }
    /**
     * 编辑选中的模型信息
     */
    function edits(obj){
        var rowData = $("#grid-table").getRowData(obj);
        var  url = '${ctx}/wxMessage/newModes?id=' + rowData.id;
        initArtDialog({url:url, title:'修改', width:"90%", height:"90%",lock:true,background: '#EAEAEA'});
    }
</script>
<script type="text/javascript">



$("#search_btn").click(function(){

    // var start=$("#start").val();

    $("#grid-table").jqGrid('setGridParam',{
        datatype:'json',
        postData:{  }, //发送数据 'search_LIKE_lrrq':start
        page:1
    }).trigger("reloadGrid"); //重新载入
});


jQuery(function($) {

    //  jqgrid
    var grid_selector = "#grid-table";
    var pager_selector = "#grid-pager";
    var start=$("#start").val();


    jQuery(grid_selector).jqGrid({
        datatype: "json", //将这里改为使用JSON数据
        mtype:"POST",
        postData:{}, //发送数据
        url:'${ctx}/wxMessage/query',
        height: '55%',
        footerrow:false,  //合计数据
        colNames:['操作 ',
            '消息类型',  '标题',
//            '文本内容',
            '消息链接,音乐链接',  '高质量连接',  '关键字描述',  '图片链接', '关注事件', ''],
        colModel:[
            {name:'edits',index:'',width:80,sortable:false, resizable:true,formatter: printthis},
            {name:'msgtype', width:100,sortable:false},
            {name:'title', width:100,sortable:false},
//            {name:'content', width:100,sortable:false},
            {name:'url', width:100,sortable:false},
            {name:'hqurl', width:100,sortable:false},
            {name:'description', width:100,sortable:false},
            {name:'picurl', width:100,sortable:false},
            {name:'yxbz', width:100,sortable:false,formatter: yxbz},
            {name:'id',index:'',width:50,sortable:false}
        ],
        rownumbers:true,//添加左侧行号
        sortname: 'id',
        sortable: false,
        viewrecords: true, //是否显示行数
        rowNum:20,
        rowList:[10,20,30],
        loadtext: '正在加载数据...',
        loadui : 'block',
        pager : pager_selector,
        altRows: true,
        shrinkToFit: true,
        //toppager: true,
//
//        multiselect: true,
//        //multikey: "ctrlKey",
//        multiboxonly: true,

//        loadComplete : function() {
//            var table = this;
//            setTimeout(function(){
//                styleCheckbox(table);
//                updateActionIcons(table);
//                updatePagerIcons(table);
//                enableTooltips(table);
//            }, 0);
//        } ,
//        ondblClickRow: openview,
//
        caption: "关键词自动回复 <input type='button' onclick='add()'  class='btn btn-mini btn-danger' value='新增'> " ,
        autowidth: true

    });

    //按钮
    function printthis(cellvalue,options,rowObject){
        var ids=rowObject.id;
        var yxbz =rowObject.spbz;
        var buttomHtml= "<a class='green' href=\"javascript:edits('" + ids + "')\" title='修改'><i class='icon-pencil bigger-130'></i>修改</a> &nbsp;&nbsp;" +
                "<a class='red' href=\"javascript:dels('" + ids + "')\" title='删除'><i class='icon-trash  bigger-130'></i>删除</a> </div> ";

//        var buttomHtml="<a href='#' class='btn btn-primary btn-mini ' onclick='opennew()'><i class='icon-print  bigger-125  '>打印</i>  </a>";
        return buttomHtml
    }

    //按钮
    function yxbz(cellvalue,options,rowObject){
        var yxbz =rowObject.yxbz;
        if(yxbz=="0"){
            return "不推送";
        }  else{
            return "<font color=red>推送</font>";
        }
    }

    function  openview(rowid,iRow,iCol,e){
        url = '${ctx}/wxMessage/view?id=' + rowid;
        initArtDialog({url:url, title:'查看', width:500, height:280,lock:true,background: '#EAEAEA'});
    }
    //enable search/filter toolbar
    //jQuery(grid_selector).jqGrid('filterToolbar',{defaultSearch:true,stringResult:true})

    //switch element when editing inline
//    function aceSwitch( cellvalue, options, cell ) {
//        setTimeout(function(){
//            $(cell) .find('input[type=checkbox]')
//                    .wrap('<label class="inline" />')
//                    .addClass('ace ace-switch ace-switch-5')
//                    .after('<span class="lbl"></span>');
//        }, 0);
//    }
    //enable datepicker



    //navButtons
    jQuery(grid_selector).jqGrid('navGrid',pager_selector,
            { 	//navbar options
                edit: false,
                editicon : 'icon-pencil blue',
                add: false,
                addicon : 'icon-plus-sign purple',
                del: false,
                delicon : 'icon-trash red',
                search: false,
                searchicon : 'icon-search orange',
                refresh: true,
                refreshicon : 'icon-refresh green',
                view: true,
                viewicon : 'icon-zoom-in grey'
            },
            {
                //edit record form
                //closeAfterEdit: true,
                recreateForm: true,
                beforeShowForm : function(e) {
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
                    style_edit_form(form);
                }
            },
            {
                //new record form
                closeAfterAdd: true,
                recreateForm: true,
                viewPagerButtons: true,
                beforeShowForm : function(e) {
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
                    style_edit_form(form);
                }
            },
            {
                //delete record form
                recreateForm: true,
                beforeShowForm : function(e) {
                    var form = $(e[0]);
                    if(form.data('styled')) return false;

                    form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
                    style_delete_form(form);

                    form.data('styled', true);
                },
                onClick : function(e) {
                }
            },
            {
                //search form
                recreateForm: true,
                afterShowSearch: function(e){
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />')
                    style_search_form(form);
                },
                afterRedraw: function(){
                    style_search_filters($(this));
                }
                ,
                multipleSearch: true
                /**
                 multipleGroup:true,
                 showQuery: true
                 */
            },
            {
                //view record form
                recreateForm: true,
                beforeShowForm: function(e){
                    var form = $(e[0]);
                    form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />')
                }
            }
    )



    function style_edit_form(form) {
        //enable datepicker on "sdate" field and switches for "stock" field
        form.find('input[name=sdate]').datepicker({format:'yyyy-mm-dd' , autoclose:true})
                .end().find('input[name=stock]')
                .addClass('ace ace-switch ace-switch-5').wrap('<label class="inline" />').after('<span class="lbl"></span>');

        //update buttons classes
        var buttons = form.next().find('.EditButton .fm-button');
        buttons.addClass('btn btn-small').find('[class*="-icon"]').remove();//ui-icon, s-icon
        buttons.eq(0).addClass('btn-primary').prepend('<i class="icon-ok"></i>');
        buttons.eq(1).prepend('<i class="icon-remove"></i>')

        buttons = form.next().find('.navButton a');
        buttons.find('.ui-icon').remove();
        buttons.eq(0).append('<i class="icon-chevron-left"></i>');
        buttons.eq(1).append('<i class="icon-chevron-right"></i>');
    }

    function style_delete_form(form) {
        var buttons = form.next().find('.EditButton .fm-button');
        buttons.addClass('btn btn-small').find('[class*="-icon"]').remove();//ui-icon, s-icon
        buttons.eq(0).addClass('btn-danger').prepend('<i class="icon-trash"></i>');
        buttons.eq(1).prepend('<i class="icon-remove"></i>')
    }

    function style_search_filters(form) {
        form.find('.delete-rule').val('X');
        form.find('.add-rule').addClass('btn btn-small btn-primary');
        form.find('.add-group').addClass('btn btn-small btn-success');
        form.find('.delete-group').addClass('btn btn-small btn-danger');
    }
    function style_search_form(form) {
        var dialog = form.closest('.ui-jqdialog');
        var buttons = dialog.find('.EditTable')
        buttons.find('.EditButton a[id*="_reset"]').addClass('btn btn-mini btn-info').find('.ui-icon').attr('class', 'icon-retweet');
        buttons.find('.EditButton a[id*="_query"]').addClass('btn btn-small btn-inverse').find('.ui-icon').attr('class', 'icon-comment-alt');
        buttons.find('.EditButton a[id*="_search"]').addClass('btn btn-small btn-purple').find('.ui-icon').attr('class', 'icon-search');
    }

    function beforeDeleteCallback(e) {
        var form = $(e[0]);
        if(form.data('styled')) return false;

        form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
        style_delete_form(form);

        form.data('styled', true);
    }

    function beforeEditCallback(e) {
//        var form = $(e[0]);
//        form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
//        style_edit_form(form);
    }



    //it causes some flicker when reloading or navigating grid
    //it may be possible to have some custom formatter to do this as the grid is being created to prevent this
    //or go back to default browser checkbox styles for the grid
    function styleCheckbox(table) {
        /**
         $(table).find('input:checkbox').addClass('ace')
         .wrap('<label />')
         .after('<span class="lbl align-top" />')


         $('.ui-jqgrid-labels th[id*="_cb"]:first-child')
         .find('input.cbox[type=checkbox]').addClass('ace')
         .wrap('<label />').after('<span class="lbl align-top" />');
         */
    }


    //unlike navButtons icons, action icons in rows seem to be hard-coded
    //you can change them like this in here if you want
    function updateActionIcons(table) {
        /**
         var replacement =
         {
             'ui-icon-pencil' : 'icon-pencil blue',
             'ui-icon-trash' : 'icon-trash red',
             'ui-icon-disk' : 'icon-ok green',
             'ui-icon-cancel' : 'icon-remove red'
         };
         $(table).find('.ui-pg-div span.ui-icon').each(function(){
						var icon = $(this);
						var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
						if($class in replacement) icon.attr('class', 'ui-icon '+replacement[$class]);
					})
         */
    }

    //replace icons with FontAwesome icons like above
    function updatePagerIcons(table) {
        var replacement =
        {
            'ui-icon-seek-first' : 'icon-double-angle-left bigger-150',
            'ui-icon-seek-prev' : 'icon-angle-left bigger-150',
            'ui-icon-seek-next' : 'icon-angle-right bigger-150',
            'ui-icon-seek-end' : 'icon-double-angle-right bigger-150'
        };
        $('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function(){
            var icon = $(this);
            var $class = $.trim(icon.attr('class').replace('ui-icon', ''));

            if($class in replacement) icon.attr('class', 'ui-icon '+replacement[$class]);
        })
    }

    function enableTooltips(table) {
        $('.navtable .ui-pg-button').tooltip({container:'body'});
        $(table).find('.ui-pg-div').tooltip({container:'body'});
    }

    //var selr = jQuery(grid_selector).jqGrid('getGridParam','selrow');

//    $( "#adds" ).on('click', function(e) {
//        e.preventDefault();
//        addr();
//    });
});


window.onresize = function  _doResize() {
    var ss = pageSize();
    $("#grid-table").jqGrid('setGridWidth', ss.WinW-10).jqGrid('setGridHeight', ss.WinH-200);
}

function pageSize() {
    var winW, winH;
    if(window.innerHeight) {// all except IE
        winW = window.innerWidth;
        winH = window.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) {// IE 6 Strict Mode
        winW = document.documentElement.clientWidth;
        winH = document.documentElement.clientHeight;
    } else if (document.body) { // other
        winW = document.body.clientWidth;
        winH = document.body.clientHeight;
    }  // for small pages with total size less then the viewport
    return {WinW:winW, WinH:winH};
}

//select2查询列表每次只查数据的前20条



</script>

</body>
</@layout>
